<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="libs :: header('角色管理')"></th:block>
</head>
<body>
  <div id="RolePage">
    <ivz-basic-view ref="vbt" :metas="metas" :config="config"
                    :search-metas="searchMetas"></ivz-basic-view>
  </div>
</body>
<th:block th:include="libs :: footer"></th:block>
<script>
    let status = [
        {value: '正常', label: '正常'},
        {value: '禁用', label: '禁用'},
    ]
  let vue = new Vue({
      el: "#RolePage",
      data: {
          metas: [
              {field: 'base', title: '基础信息', metas: [
                      {field: 'name', title: '角色名称', width: 180, required: true},
                      {field: 'status', title: '状态', clear: true, width:100
                          , type: 'select', data: status, default: '正常'},
                      {field: 'remark', title: '备注', width: 380},
                  ]},
              {field: 'function', title: '权限设置', metas: [
                      {field: 'menuIds', title: '功能权限', type: 'tree', isTable: false
                          , clear: true, url: '/core/menu/view', default: [], config: {
                              showLine: true
                            }
                          , event: {
                              // url数据加载完成事件
                              loadFinished: function(data, meta) {
                                  let expandKeys = [];
                                  vue.$resolver.resolverTree(data, function (data) {
                                      if(data.type == 'M') {
                                          expandKeys.push(data.id);
                                      }
                                  });
                                  meta.config.expandedKeys = expandKeys;
                              }
                          }
                      },
                  ]
              },
              {field: 'createTime', title: '创建时间', type: 'date', width: 180, isForm: false},
              {field: 'action', title: '操作', type: 'action'}
          ],
          searchMetas: [
              {field: 'name', title: '角色名称', clear: true},
              {field: 'status', title: '状态', type: 'select', data: status, clear: true},
          ],
          config: {
              form: {
                  type: 'group',
                  editSource: 'remote' // 声明编辑的数据来自于远程服务器
              }
          },
      },
  });
</script>
</html>
